<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="../css/reg.css" />
    <link rel="stylesheet" href="../css/base.css" />
    <script src="../js/reg.js"></script>
    <script src="../js/jquery.js"></script>
  </head>
  <body>
    <!-- 注册页 -->
    <div class="header">
      <img src="../img/logo.png" alt="" />
    </div>
    <div class="ban">
      <div class="box">
        <img src="../img/0.png" alt="" />

        <div class="zzz">
          <h1>使用手机号注册</h1>
          <input type="text" / placeholder="手机号" class="account"><span
          ></span> <input type="text" / placeholder="短信验证码"
          class="name"><span></span> <input type="text" / placeholder="密码"
          class="password"><span></span> <input type="text" /
          placeholder="确认密码" class="confirm"><span></span>
          <h3>密码长度必须在8位以上，含大小写字母、数字、符号至少三种</h3>
          <h3>我已阅读并同意 《隐私协议》与《用户服务协议》</h3>
          <h2>注册</h2>
        </div>
      </div>
    </div>
    <script>
      var oInput = document.querySelectorAll("input");
      var ospan = document.querySelectorAll("span");
      // 账号
      var reg = /\S/;
      oInput[0].onblur = function () {
        var val = this.value;
        if (reg.test(val) == false) {
          ospan[0].innerText = "参数不能为空";
          ospan[0].style.display = "block";
        } else {
          ospan[0].style.display = "none";
          // ospan[0].innerText="输入正确";
          // after("输入正确");
        }
      };
      // 密码
      var reg = /\S/;
      oInput[1].onblur = function () {
        var val = this.value;
        if (reg.test(val) == false) {
          ospan[1].innerText = "参数不能为空";
        } else {
          ospan[1].style.display = "none";
          // after("输入正确");
        }
      };
      var reg = /\S/;
      oInput[2].onblur = function () {
        var val = this.value;
        if (reg.test(val) == false) {
          ospan[2].innerText = "参数不能为空";
          ospan[2].style.display = "block";
        } else {
          ospan[2].style.display = "none";
          // ospan[0].innerText="输入正确";
          // after("输入正确");
        }
      };
      // 密码
      var reg = /\S/;
      oInput[3].onblur = function () {
        var val = this.value;
        if (reg.test(val) == false) {
          ospan[3].innerText = "参数不能为空";
        } else {
          ospan[3].style.display = "none";
          // after("输入正确");
        }
      };
      $("h2").click(function () {
        if (
          $(".account").val() &&
          $(".password").val() &&
          $(".confirm").val() != null
        ) {
          $.get("http://jx.xuzhixiang.top/ap/api/reg.php", {
            username: $(".account").val(),
            password: $(".password").val(),
            password: $(".confirm").val(),
          }).then((res) => {
            console.log(res);
            if (res.code == 1) {
              console.log("注册成功");
              location.href = "../html/login.html";
            } else {
              console.log("注册失败");
            }
          });
        }
      });
    </script>
  </body>
</html>
